$(function(){
    if ( $("#fileList").length > 0 ) {
        /**
         *  图片上传模块
         *  @author zx
         *  @date 2019-12-19
         **/
        let $list = $("#fileList"),
            state = "pending",
            pathInput = $('#filePicker').next();

        var uploader = WebUploader.create({
            auto: true,
            swf: 'static/admin/lib/webuploader/0.1.5/Uploader.swf',

            // 文件接收服务端。
            server: '/admin/common/uploader',

            // 选择文件的按钮。可选。
            // 内部根据当前运行是创建，可能是input元素，也可能是flash.
            pick: {
                id:'#filePicker',
                multiple:false
            },

            // 不压缩image, 默认如果是jpeg，文件上传前会压缩一把再上传！
            resize: false,
            // 只允许选择图片文件。
            accept: {
                title: 'Images',
                extensions: 'gif,jpg,jpeg,bmp,png',
                mimeTypes: 'image/*'
            },
            // 验证文件总数目,超出则不加入队列
            // fileNumLimit: 2
        });
        //加入队列前处理
        uploader.on('beforeFileQueued', function( file ) {
            $list.empty();
            uploader.reset();
        })
        uploader.on( 'fileQueued', function( file ) {
            let $li = $(
                '<div id="' + file.id + '" class="item">' +
                '<div class="pic-box"><img></div>'+
                '<div class="info">' + file.name + '</div>' +
                '<p class="state">等待上传...</p>'+
                '</div>'
                ),
                $img = $li.find('img');
            $list.append( $li );

            // 创建缩略图
            // 如果为非图片文件，可以不用调用此方法。
            // thumbnailWidth x thumbnailHeight 为 100 x 100
            let thumbnailWidth = 70;
            let thumbnailHeight = 100;
            uploader.makeThumb( file, function( error, src ) {
                if ( error ) {
                    $img.replaceWith('<span>不能预览</span>');
                    return;
                }

                $img.attr( 'src', src );
            }, thumbnailWidth, thumbnailHeight );
        });
        // 文件上传过程中创建进度条实时显示。
        uploader.on( 'uploadProgress', function( file, percentage ) {
            let $li = $( '#'+file.id ),
                $percent = $li.find('.progress-box .sr-only');

            // 避免重复创建
            if ( !$percent.length ) {
                $percent = $('<div class="progress-box"><span class="progress-bar radius"><span class="sr-only" style="width:0%"></span></span></div>').appendTo( $li ).find('.sr-only');
            }
            $li.find(".state").text("上传中");
            $percent.css( 'width', percentage * 100 + '%' );
        });

        // 文件上传成功，给item添加成功class, 用样式标记上传成功。
        uploader.on( 'uploadSuccess', function( file, data ) {
            if ( data.code == 200 ) {
                $( '#'+file.id ).addClass('upload-state-success').find(".state").text("已上传");
                pathInput.val(data.data.path);
            } else {
                $( '#'+file.id ).addClass('upload-state-error').find(".state").text(data.message);
            }
        });

        // 文件上传失败，显示上传出错。
        uploader.on( 'uploadError', function( file ) {
            $( '#'+file.id ).addClass('upload-state-error').find(".state").text("上传出错");
        });

        // 完成上传完了，成功或者失败，先删除进度条。
        uploader.on( 'uploadComplete', function( file ) {
            $( '#'+file.id ).find('.progress-box').fadeOut();
        });
        uploader.on('all', function (type) {
            if (type === 'startUpload') {
                state = 'uploading';
            } else if (type === 'stopUpload') {
                state = 'paused';
            } else if (type === 'uploadFinished') {
                state = 'done';
            }
        });
    }

    if ( $("#fileListAudio").length > 0 ) {
        /**
         *  音频上传模块
         *  @author zx
         *  @date 2019-12-20
         **/
        let $listAudio = $("#fileListAudio"),
            stateAudio = "pending",
            pathInputAudio = $('#filePickerAudio').next();

        var uploaderAudio = WebUploader.create({
            auto: true,
            swf: 'static/admin/lib/webuploader/0.1.5/Uploader.swf',

            // 文件接收服务端。
            server: '/admin/common/audio',

            // 选择文件的按钮。可选。
            // 内部根据当前运行是创建，可能是input元素，也可能是flash.
            pick: {
                id:'#filePickerAudio',
                multiple:false
            },

            // 不压缩image, 默认如果是jpeg，文件上传前会压缩一把再上传！
            resize: false,
            // 只允许选择图片文件。
            accept: {
                title: 'Audio',
                extensions: 'm4a,wav,mp3,aac',
                mimeTypes: 'audio/mp4,audio/x-wav,audio/mpeg,audio/x-aac'
            },
            // 验证文件总数目,超出则不加入队列
            // fileNumLimit: 2
        });
        //加入队列前处理
        uploaderAudio.on('beforeFileQueued', function( file ) {
            $listAudio.empty();
            uploaderAudio.reset();
        })
        uploaderAudio.on( 'fileQueued', function( file ) {
            let $li1 = $(
                '<div id="' + file.id + '" class="item">' +
                '<div class="pic-box"><audio controls="controls">您的浏览器暂不支持audio</audio></div>'+
                '<div class="info">' + file.name + '</div>' +
                '<p class="state">等待上传...</p>'+
                '</div>'
                ),
                $audio = $li1.find('audio');
            $listAudio.append( $li1 );
        });
        // 文件上传过程中创建进度条实时显示。
        uploaderAudio.on( 'uploadProgress', function( file, percentage ) {
            let $li1 = $( '#'+file.id ),
                $percent1 = $li1.find('.progress-box .sr-only');

            // 避免重复创建
            if ( !$percent1.length ) {
                $percent1 = $('<div class="progress-box"><span class="progress-bar radius"><span class="sr-only" style="width:0%"></span></span></div>').appendTo( $li1 ).find('.sr-only');
            }
            $li1.find(".state").text("上传中");
            $percent1.css( 'width', percentage * 100 + '%' );
        });

        // 文件上传成功，给item添加成功class, 用样式标记上传成功。
        uploaderAudio.on( 'uploadSuccess', function( file, data ) {
            if ( data.code == 200 ) {
                $( '#'+file.id ).addClass('upload-state-success').find(".state").text("已上传");
                pathInputAudio.val(data.data.path);
                $( '#'+file.id ).find('audio').attr('src', data.data.path);
            } else {
                $( '#'+file.id ).addClass('upload-state-error').find(".state").text(data.message);
            }
        });

        // 文件上传失败，显示上传出错。
        uploaderAudio.on( 'uploadError', function( file ) {
            $( '#'+file.id ).addClass('upload-state-error').find(".state").text("上传出错");
        });

        // 完成上传完了，成功或者失败，先删除进度条。
        uploaderAudio.on( 'uploadComplete', function( file ) {
            $( '#'+file.id ).find('.progress-box').fadeOut();
        });
        uploaderAudio.on('all', function (type) {
            if (type === 'startUpload') {
                stateAudio = 'uploading';
            } else if (type === 'stopUpload') {
                stateAudio = 'paused';
            } else if (type === 'uploadFinished') {
                stateAudio = 'done';
            }
        });
    }

    if ( $("#fileListAudio1").length > 0 ) {
        /**
         *  音频上传模块(1)
         *  @author zx
         *  @date 2019-12-20
         **/
        let $listAudio1 = $("#fileListAudio1"),
            stateAudio1 = "pending",
            pathInputAudio1 = $('#filePickerAudio1').next();

        var uploaderAudio1 = WebUploader.create({
            auto: true,
            swf: 'static/admin/lib/webuploader/0.1.5/Uploader.swf',

            // 文件接收服务端。
            server: '/admin/common/audio',

            // 选择文件的按钮。可选。
            // 内部根据当前运行是创建，可能是input元素，也可能是flash.
            pick: {
                id:'#filePickerAudio1',
                multiple:false
            },

            // 不压缩image, 默认如果是jpeg，文件上传前会压缩一把再上传！
            resize: false,
            // 只允许选择图片文件。
            accept: {
                title: 'Audio',
                extensions: 'm4a,wav,mp3,aac',
                mimeTypes: 'audio/mp4,audio/x-wav,audio/mpeg,audio/x-aac'
            },
            // 验证文件总数目,超出则不加入队列
            // fileNumLimit: 2
        });
        //加入队列前处理
        uploaderAudio1.on('beforeFileQueued', function( file ) {
            $listAudio1.empty();
            uploaderAudio1.reset();
        })
        uploaderAudio1.on( 'fileQueued', function( file ) {
            let $li1 = $(
                '<div id="' + file.id + '" class="item">' +
                '<div class="pic-box"><audio controls="controls">您的浏览器暂不支持audio</audio></div>'+
                '<div class="info">' + file.name + '</div>' +
                '<p class="state">等待上传...</p>'+
                '</div>'
                ),
                $audio = $li1.find('audio');
            $listAudio1.append( $li1 );
        });
        // 文件上传过程中创建进度条实时显示。
        uploaderAudio1.on( 'uploadProgress', function( file, percentage ) {
            let $li1 = $( '#'+file.id ),
                $percent1 = $li1.find('.progress-box .sr-only');

            // 避免重复创建
            if ( !$percent1.length ) {
                $percent1 = $('<div class="progress-box"><span class="progress-bar radius"><span class="sr-only" style="width:0%"></span></span></div>').appendTo( $li1 ).find('.sr-only');
            }
            $li1.find(".state").text("上传中");
            $percent1.css( 'width', percentage * 100 + '%' );
        });

        // 文件上传成功，给item添加成功class, 用样式标记上传成功。
        uploaderAudio1.on( 'uploadSuccess', function( file, data ) {
            if ( data.code == 200 ) {
                $( '#'+file.id ).addClass('upload-state-success').find(".state").text("已上传");
                pathInputAudio1.val(data.data.path);
                $( '#'+file.id ).find('audio').attr('src', data.data.path);
            } else {
                $( '#'+file.id ).addClass('upload-state-error').find(".state").text(data.message);
            }
        });

        // 文件上传失败，显示上传出错。
        uploaderAudio1.on( 'uploadError', function( file ) {
            $( '#'+file.id ).addClass('upload-state-error').find(".state").text("上传出错");
        });

        // 完成上传完了，成功或者失败，先删除进度条。
        uploaderAudio1.on( 'uploadComplete', function( file ) {
            $( '#'+file.id ).find('.progress-box').fadeOut();
        });
        uploaderAudio1.on('all', function (type) {
            if (type === 'startUpload') {
                stateAudio1 = 'uploading';
            } else if (type === 'stopUpload') {
                stateAudio1 = 'paused';
            } else if (type === 'uploadFinished') {
                stateAudio1 = 'done';
            }
        });
    }

})